<template>
	<view class="content">
		<view class="item" @click="itemClick('picker')">
			ui-picker
		</view>
		<view class="item" @click="itemClick('bradge')">
			ui-badge
		</view>
		<view class="item" @click="itemClick('section')">
			ui-section
		</view>
		<view class="item" @click="itemClick('combox')">
			ui-combox
		</view>
		<view class="item" @click="itemClick('countdown')">
			ui-countdown
		</view>
		<view class="item" @click="itemClick('datacheckbox')">
			ui-datacheckbox
		</view>
		<view class="item" @click="itemClick('datepicker')">
			ui-datepicker
		</view>
		<view class="item" @click="itemClick('before')">
			ui-before
		</view>
		<view class="item" @click="itemClick('backgroundimg')">
			ui-backgroundimg
		</view>
		<view class="item" @click="itemClick('bgA')">
			ui-bgA
		</view>
		<view class="item" @click="itemClick('bgB')">
			ui-bgB
		</view>
		<view class="item" @click="itemClick('wrap')">
			ui-wrap
		</view>
		<view class="item" @click="itemClick('easyinput')">
			ui-easyinput
		</view>
		<view class="item" @click="itemClick('forms')">
			ui-forms
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		onLoad() {

		},
		methods: {
			itemClick(e){
				uni.navigateTo({
					url:"/pages/" + e + '/' + e
				})
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		
	}
	.picker-region {
		padding: 20rpx;
		border-radius: 10rpx;
		border: 1rpx solid #c6c6c6;
		margin-top: 20rpx;
	}
	.item {
		margin-top: 20rpx;
		padding: 20rpx;
		border-radius: 10rpx;
		border: 1rpx solid #c6c6c6;
		font-size: 28rpx;
	}
</style>
